/** @type {import('tailwindcss').Config} */
module.exports = {
  // 手动切换暗模式
  darkMode: 'class',
  // Tailwind 应用范围
  content: ['./index.html', './src/**/*.{vue,js}'],
  // 取消tailwind的默认初始化样式配置
  corePlugins: {
    preflight: false
  },
  theme: {
    extend: {
      height: {
        header: '72px',
        main: 'calc(100vh - 72px)',
        part: 'calc(100vh - 122px - 160px)',
        mainContent: 'calc(100vh - 122px)',
        menuHeight: 'calc(100vh - 90px)',
        mainHeight: 'calc(100% - 80px - 27px)',
        mainHeight2: 'calc(100% - 80px - 27px - 50px)',
        mainHeight3: 'calc(100% - 70px)',
        mainHeight4: 'calc(100% - 64px)',
        mainHeight5:'calc(100% - 240px)',
        chartHeight: 'calc(100% - 42px)'
      },
      width: {
        mainWidth: 'calc(100% - 256px)',
        drawWidth: 'calc(100% - 40px)'
      },
      fontSize: {
        // 字体大小+行高
        // xs: ['0.25rem', '0.35rem'],
        // sm: ['0.35rem', '0.45rem'],
        // base: ['0.42rem', '0.52rem'],
        // lg: ['0.55rem', '0.65rem'],
        // xl: ['0.65rem', '0.75rem']
      },
      boxShadow: {
        'l-white': '-10px 0 10px white',
        'l-zinc': '-10px 0 10px #18181b'
      },
      colors: {
        main: '#f44c58',
        'hover-main': '#f32836',
        'success-100': '#F2F9EC',
        'success-200': '#E4F2DB',
        'success-300': '#7EC050',
        'warn-100': '#FCF6ED',
        'warn-200': '#F8ECDA',
        'warn-300': '#DCA550',
        'error-100': '#ED7456',
        'error-200': '#f3471c',
        'error-300': '#ffffff',
        active: '#01eff5'
      },
      backdropBlur: {
        '4xl': '240px'
      },
      background: {
        hoverBg: 'radial-gradient(rgba(0, 0, 0, 0.1), rgba(0, 174, 255, 0.8))'
      },
      variants: {
        scrollbar: ['dark']
      }
    }
  },
  plugins: [require('tailwind-scrollbar')]
}
